<template>
  <div class="p-b-15">
    <div class="table-title">
      支付方式
    </div>
    <div class="table-padding">
      <div style="margin: 20px;"></div>
      <el-row>
        <el-col :span="24">
          <el-form :model="modelForm" ref="modelForm" label-width="100px" class="demo-ruleForm switch" style="width:60%;margin:0 auto">
            <el-form-item>
              <div class="el-input el-input-group el-input-group--prepend">
                <div class="el-input-group__prepend">支付类型</div>
                <div style="border:1px solid #ccc;" v-if="id==''">
                  <el-radio-group  v-model="modelForm.type">
                    <el-radio :label="item.key" :value="item.key" v-for="item in payType" style="margin: 10px;"
                              v-if="item.key!='CASH' && item.key!='VIPCARD' && item.key!='GUAZHANG' && item.key!='CASHIER' ">
                      {{item.text}}
                    </el-radio>
                  </el-radio-group>

                </div>
                <div style="border:1px solid #ccc;padding:6px 0px;padding-left: 10px;" v-if="id!=''">
                  <span  class="text-left" >
                  <span v-if="modelForm.type=='CASHIER'">悦收银</span>
                  <span v-if="modelForm.type=='COUPON'">优惠券</span>
                  <span v-if="modelForm.type=='THIRDPARTY'">第三方</span>
                  <span v-if="modelForm.type=='BANKCARD'">银行卡</span>
                  <span v-if="modelForm.type=='VIPCARD'">会员卡支付</span>
                  <span v-if="modelForm.type=='VIPCARD'">会员卡支付</span>
                  <span v-if="modelForm.type=='GUAZHANG'">挂账支付</span>
                  <span v-if="modelForm.type=='CASH'">现金支付</span>
                </span>
                </div>
              </div>


            </el-form-item>
            <el-form-item label="" prop="name" :rules="[{ required: true, message: '请输入支付名称', trigger: 'blur'}]">
              <el-input placeholder="请输入支付名称" v-model="modelForm.name" size="medium">
                <template slot="prepend">
                  <el-tooltip placement="top" content="请填写支付名称">
                    <el-button tabIndex="-1">支付名称</el-button>
                  </el-tooltip>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="" prop="integral" :rules="[]" >
              <div class="el-input el-input-group el-input-group--prepend">
                <div class="el-input-group__prepend">会员消费可积分</div>
                <div style="border:1px solid #ccc;padding:6px 0px;">
                  <el-switch class="text-left" style="padding-left: 10px;"
                             v-model="modelForm.integral"
                             active-color="#13ce66"
                             inactive-color="#ff4949"
                             active-text="是"
                             inactive-text="否">
                  </el-switch>
                </div>
              </div>

            </el-form-item>
            <el-form-item label="" prop="integral" :rules="[]" class="switch">
              <div class="el-input el-input-group el-input-group--prepend">
                <div class="el-input-group__prepend">是否适用于会员充值</div>
                <div style="border:1px solid #ccc;padding:6px 0px;">
                  <el-switch class="text-left" style="padding-left: 10px;"
                    v-model="modelForm.recharge" :disabled="modelForm.type=='COUPON'"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                    active-text="是"
                    inactive-text="否">
                  </el-switch>
                </div>
              </div>

            </el-form-item>

            <!--团购支付-->
            <div v-if="modelForm.type=='BUYCOUPON'">
              <div style="margin:4vh 0;border:1px solid #e2e2e3"></div>
              <el-form-item label="团购券类型 " prop="buyType"
                            :rules="[]">
                <el-radio-group v-model="groupConfig.buyType" :disabled="isEdit">
                  <el-radio :label="i.key" v-for="i in couponType" :key="i.key">
                    <span>{{i.text}}</span>
                  </el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="团购网站" prop="site"
                            :rules="[{ required: true, message: '请选择团购网站', trigger: 'blur'}]">
                <el-select v-model="groupConfig.site" placeholder="请选择团购网站"
                           :disabled="isEdit" style="width:100%;">
                  <el-option v-for="item in buySite" :key="item.key" :label="item.text"
                             :value="item.key"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="不适用菜品" prop="" :rules="[]" v-if="groupConfig.buyType=='MONEY'">
                <el-button type="text" @click="showDishes">已选择{{groupConfig.selectDishes.length}}样菜品</el-button>
                <br/>
              </el-form-item>
              <el-form-item label="可兑换菜品" prop="" :rules="[]" v-if="groupConfig.buyType=='DISHES'">
                <el-button type="text" @click="acceptDishes">
                  <span v-if="groupConfig.dishes!=null">{{groupConfig.dishes.name}}</span>
                  <span v-else>请选择菜品</span>
                </el-button>
              </el-form-item>
              <el-form-item v-if="groupConfig.buyType=='MONEY'" label="面值" prop="faceValue"
                            :rules="[{ type:'number',required: true, message: '请输入面值', trigger: 'blur'},rules.numPot2]">
                <el-input placeholder="请输入面值" v-model.number="groupConfig.faceValue" size="medium"
                          @blur="isDouble(couponConfig, 'faceValue')">
                  <template slot="append">元</template>
                </el-input>
              </el-form-item>
              <el-form-item label="" prop="realPrice"
                            :rules="[{type:'number', required: true, message: '请输入券实收金额', trigger: 'blur'},rules.numPot2]">
                <el-input placeholder="请输入券实收金额" v-model.number="groupConfig.realPrice" size="medium"
                          @blur="isDouble(groupConfig,'realPrice')">
                  <template slot="prepend">
                    <el-tooltip placement="top" content="请输入券实收金额">
                      <el-button tabIndex="-1">券实收</el-button>
                    </el-tooltip>
                  </template>
                  <template slot="append">元</template>
                </el-input>
                <div style="font-size: 12px;color:#4C6982">
                  顾客使用该类型的券会将此金额记为实收，建议填写商户与第三方平台（如美团、大众点评）的券交易价。
                </div>
              </el-form-item>
              <div style="margin:4vh 0;border:1px solid #e2e2e3"></div>
            </div>

            <!--优惠券支付-->

            <div v-if="modelForm.type=='COUPON'">

                <div style="margin:4vh 0;border:1px solid #e2e2e3"></div> <!--{ required: true, message: '请输入券实收金额', trigger: 'blur'},-->
                <el-form-item label="" prop="realPrice"
                              :rules="[rules.numPot2]">
                  <el-input placeholder="请输入券实收金额" v-model="couponConfig.realPrice" size="medium"
                            @blur="isDouble(couponConfig,'realPrice')">
                    <template slot="prepend">
                      <el-tooltip placement="top" content="请输入券实收金额">
                        <el-button tabIndex="-1">券实收</el-button>
                      </el-tooltip>
                    </template>
                    <template slot="append">元</template>
                  </el-input>
                  <div style="font-size: 12px;color:#4C6982">
                    顾客使用该类型的券会将此金额记为实收，建议填写商户与第三方平台（如美团、大众点评）的券交易价。
                  </div>
                </el-form-item><!--{required: true, message: '请输入面值', trigger: 'blur'},-->
                <el-form-item label="" prop="faceValue"
                              :rules="[rules.numPot2]">
                  <el-input placeholder="请输入面值" v-model="couponConfig.faceValue" size="medium"
                            @blur="isDouble(couponConfig, 'faceValue')">
                    <template slot="prepend">
                      <el-tooltip placement="top" content="请输入面值">
                        <el-button tabIndex="-1">面值</el-button>
                      </el-tooltip>
                    </template>
                    <template slot="append">元</template>
                  </el-input>
                </el-form-item>
                <div style="margin:4vh 0;border:1px solid #e2e2e3"></div>


            </div>


            <!--悦收银-->
            <div v-if="modelForm.type=='CASHIER'">
              <div style="margin:4vh 0;border:1px solid #e2e2e3"></div>
              <el-form-item label="" prop="merchantNo" :rules="[]">
                <el-input placeholder="请输入商户号" v-model="scanBarConfig.merchantNo" size="medium">
                  <template slot="prepend">
                    <el-tooltip placement="top" content="请输入商户号">
                      <el-button tabIndex="-1">商户号</el-button>
                    </el-tooltip>
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="" prop="terminalId" :rules="[]">
                <el-input placeholder="请输入终端号" v-model="scanBarConfig.terminalId" size="medium">
                  <template slot="prepend">
                    <el-tooltip placement="top" content="请输入终端号">
                      <el-button tabIndex="-1">终端号</el-button>
                    </el-tooltip>
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="" prop="token" :rules="[]">
                <el-input placeholder="请输入身份令牌" v-model="scanBarConfig.token" size="medium">
                  <template slot="prepend">
                    <el-tooltip placement="top" content="请输入身份令牌">
                      <el-button tabIndex="-1">身份令牌</el-button>
                    </el-tooltip>
                  </template>
                </el-input>
              </el-form-item>
              <!--<el-form-item label="审核" prop="state" :rules="[]">-->
                <!--<el-checkbox v-model="scanBarConfig.state">是否审核</el-checkbox>-->
              <!--</el-form-item>-->
              <div style="margin:4vh 0;border:1px solid #e2e2e3"></div>
            </div>

            <el-form-item label="" prop="remark" :rules="[]">
              <div class="el-input el-input-group el-input-group--prepend">
                <div class="el-input-group__prepend">备注</div>
                <div style="border:1px solid #ccc;">
                  <el-input style="border:0px;"
                    type="textarea"
                    :rows="3"
                    placeholder="请输入备注"
                    v-model="modelForm.remark">
                  </el-input>
                </div>
              </div>
            </el-form-item>
            <div class="foot-bar-button ">
              <el-button type="primary" @click="submitForm('modelForm')" size="medium">提交</el-button>
              <el-button @click="goBack" size="medium">返回</el-button>
            </div>
          </el-form>
        </el-col>

      </el-row>

      <!--现金券 多选排除菜品-->
      <el-dialog title="选择菜品" class="noselect"  :close-on-click-modal="false"
                 :visible.sync="showDishesTable" :before-close="disheTableClose">
        <el-row style="height: 660px">
          <el-col :span="10" style="border-right: 1px solid #ddd;height: 100%">
            <div class="dialog-title">
              待选
            </div>
            <br>
            <div>
              <el-input placeholder="请输入内容" v-model="searchText">
                <el-button slot="append" icon="search" @click="searchTextClick"></el-button>
              </el-input>
            </div>
            <div class="text-right">
              <el-button type="text" @click="selectAllDishe">全选</el-button>
              &nbsp;&nbsp;&nbsp;
              <el-button type="text" @click="noSelectAllDishe">全不选</el-button> &nbsp;&nbsp;
            </div>
            <el-row style="border-top: 1px solid #ddd;height: 88%;margin-left: -15px">
              <el-col :span="6" style="border-right: 1px solid #ddd;height: 100%;overflow-y: auto">
                <div class="cateItem" :class="{cateItemActive:i.cate.isSelect}"
                     @click="cateClick(i.cate)" v-for="i in initModeldishes">
                  {{i.cate.name}}
                </div>
              </el-col>
              <el-col :span="18" style="height: 100%;overflow-y: auto">
                <div v-for="i in initModeldishes">
                  <div class="dishes-item" v-if="i.cate.id!='' && i.cate.id==selectCate.id"
                       v-for="item in i.dishes">
                    <el-checkbox v-model="item.isSelect">{{item.name}}</el-checkbox>
                  </div>
                  <div class="dishes-item" v-if="selectCate.id=='' && item.isSearch"
                       v-for="item in i.dishes">
                    <el-checkbox v-model="item.isSelect">{{item.name}}</el-checkbox>
                  </div>

                </div>
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="2" :offset="1" style="line-height: 650px">
            <el-button type="primary" @click="addDishes">添加<i class="el-icon-arrow-right el-icon--right"></i></el-button>
          </el-col>
          <el-col :span="10" :offset="1" style="border-left: 1px solid #ddd;height: 100%">
            <div class="dialog-title-right">
              已选
            </div>
            <div class="text-right">
              <el-button type="text" @click="groupConfig.selectDishes=[]">清空</el-button>
            </div>
            <div>
              <div class="select-dishes-list">
                <div class="select-dishes-item" v-for="(item,index) in groupConfig.selectDishes">
                  <el-row>
                    <el-col :span="20">
                      {{item.name}}
                    </el-col>
                    <el-col :span="4" class="text-center">
                      <i class="el-icon-close" @click="groupConfig.selectDishes.splice(index,1)"></i>
                    </el-col>
                  </el-row>
                </div>
              </div>
            </div>
          </el-col>
        </el-row>
        <div class="foot-bar-button">
          <el-button type="primary" @click="showDishesTable=false">确认</el-button>
          <el-button @click="showDishesTable=false">取消</el-button>
        </div>
      </el-dialog>

      <!--菜品券 选中单菜品-->
      <el-dialog title="选择菜品" class="noselect"  :close-on-click-modal="false"
                 :visible.sync="showAcceptDishes" :before-close="disheTableClose">
        <div style="margin-top: 20px;">
          <el-input placeholder="请输入菜品" v-model="searchText">
            <el-button slot="append" icon="search" @click="searchTextClick"></el-button>
          </el-input>
        </div>
        <el-row style="border-top: 1px solid #ddd;height: 88%;margin:20px;margin-left: -15px;">
          <el-col :span="6" style="border-right: 1px solid #ddd;height: 100%;overflow-y: auto">
            <div class="cateItem" :class="{cateItemActive:i.cate.isSelect}" @click="changeCate(i.cate)"
                 v-for="i in initModeldishes">
              {{i.cate.name}}
            </div>
          </el-col>
          <el-col :span="18">
            <div v-for="i in initModeldishes" style="margin-left: 10px;margin-top: 10px;">
              <el-radio-group v-model="groupConfig.dishes" v-if="i.cate.id!='' && i.cate.id==selectCate.id">
                <el-radio :label="item" v-for="item in i.dishes"
                          style="padding:10px;">
                  {{item.name}}
                </el-radio>
              </el-radio-group>
              <el-radio-group v-model="groupConfig.dishes" v-if="selectCate.id=='' && item.isSearch" >
                <el-radio :label="item" v-for="item in i.dishes"
                          style="padding:10px;">{{item.name}}
                </el-radio>
              </el-radio-group>
            </div>

          </el-col>
        </el-row>
        <div class="foot-bar-button">
          <el-button type="primary" @click="showAcceptDishes=false;">确认</el-button>
          <el-button @click="showAcceptDishes=false">取消</el-button>
        </div>
      </el-dialog>

    </div>
  </div>
</template>
<script>
  //注意路径
  export default {
    data() {
      return {
        modelForm: {
          state: "NORMAL",
          faceValue: 0,  //面值
          realPrice: 0, //实收
          buyType: "",//团购券类型
          site: "UNKNOW",//团购网站
          noAccept: "",//不适用菜品
          accept: "",//可兑换菜品
        },
        showDialog: false,
        activityId: "",
        isSave: true,
        payType: [],
        state: [],
        isEdit: false,
        id: "",
        couponType: [],
        buySite: [],
        initModeldishes: [],
        selectCate: {},
        searchText: "",
        searchData: [],
        showDishesTable: false,
        dishs: [],
        showAcceptDishes: false,
        companyName:"",

        //团购券
        groupConfig:{
          buyType:"MONEY",
          selectDishes:[],
          dishes:null
        },
        couponConfig:{},//优惠券支付
        scanBarConfig:{state:false}//悦收银
      };
    },
    created() {
      window.this = this;
      if (this.$route.query.id != null) {
        this.id = this.$route.query.id;
      }
      this.companyName=window.companyName;
      this.initData();

    },
    methods: {
      /*可兑换菜品*/
      acceptDishes() {
        this.$http.get("coupons/findSelectDishes?dishesName=").then((data) => {
          if (data.status == 200 && data.content.length > 0) {
            for (let i = 0; i < data.content.length; i++) {
              data.content[i].cate.isSelect = false;
              for (let s = 0; s < data.content[i].dishes.length; s++) {
                data.content[i].dishes[s].isSelect = false;
              }
            }
            this.initModeldishes = data.content;
            //可兑换

            if(this.groupConfig.dishes!=null){
              var item = this.initModeldishes.find(x=>x.cate.id==this.groupConfig.dishes.cateId);
              if(item){
                this.selectCate = item.cate;
                item.cate.isSelect = true;
              }
            }else{
              this.initModeldishes[0].cate.isSelect=true;
              this.selectCate = this.initModeldishes[0].cate;
            }
          }
        });
        this.showAcceptDishes = true;
      },
      changeCate(item) {
        if (!item.isSelect) {
          for (let i = 0; i < this.initModeldishes.length; i++) {
            this.initModeldishes[i].cate.isSelect = false;
            for (let s = 0; s < this.initModeldishes[i].dishes.length; s++) {
              this.initModeldishes[i].dishes[s].isSelect = false;
            }
          }
          item.isSelect = true;
          this.selectCate = item;
        }
      },
      //页面第一次进来获取表单需要的数据
      initData() {
        if (this.id != '') {
          this.activityId = this.id;
          this.isSave = false;
          this.isEdit = true;
          this.$axios.get("pays/payments/" + this.activityId + "/update").then(res=> {
            let data = res.content;
            //
            // this.state = data.state;
            this.payType = data.paymentTypes;
            console.log(this.payType);

            this.modelForm= data.payment;
            //处理configs中字段
            var configs = data.payment.params;
            console.log(configs)
            configs=JSON.parse(configs);
            console.log(configs);

            //优惠券支付
            if(this.modelForm.type=="COUPON"){
              this.couponConfig =configs;
            }
            //悦收银
            if(this.modelForm.type=="CASHIER"){
              this.scanBarConfig =configs;

            }
            this.buySite = data.buySite;
            this.couponType = data.couponType;







          });
        } else {
          this.isSave = true;
          this.isEdit = false;
          this.$axios.get("pays/payments/create").then(res=>{
            let data = res.content;
            // this.couponType = data.couponType;
            //
            // this.state = data.state;
            this.payType = data.paymentTypes;
            this.buySite = data.buySite;

            this.modelForm= data.payment;
          });
        }
      },
      goBack() {
        this.router.go(-1);
      },
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            var configs = {};
            //团购券支付
            if(this.modelForm.type=="BUYCOUPON"){
              configs = this.groupConfig;
            }
            //优惠券支付
            if(this.modelForm.type=="COUPON"){
              configs = this.couponConfig;
            }
            //悦收银
            if(this.modelForm.type=="CASHIER"){
              configs = this.scanBarConfig ;
            }
            this.modelForm.params = JSON.stringify(configs);
            if (this.isSave) {
              this.$axios.post("pays/payments/create", this.modelForm).then(data=>{
                if (data.status == 200) {
                  this.$message({
                    message: data.message,
                    type: 'success'
                  });
                  this.router.go(-1);
                } else {
                  this.$message.error(data.message);
                }
              })
            } else {
              this.modelForm._method = "PUT";
              this.$axios.put("pays/payments/" + this.activityId + "/update", this.modelForm).then(data=> {
                if (data.status == 200) {
                  this.$message({
                    message: data.message,
                    type: 'success'
                  });
                  this.router.go(-1);
                } else {
                  this.$message.error(data.message);
                }
              });
            }
          } else {
            return false;
          }
        });
      },

      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      isNum(item, key) {
        var r = /^\+?[1-9][0-9]*$/;
        if (!r.test(item[key])) {
          item[key] = "0.00"
        } else {
          item[key] = item[key]
        }
      },
      isDouble(item, key) {
        if(!item[key]){
          item[key]="0.00";
        }
        var isNum = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
        if (!isNum.test(item[key])) {
          item[key] = "0.00"
        } else {
          item[key] = item[key]
        }
      },
      /*选择不适用菜品*/
      showDishes() {
        this.findSelectDishes("");
        this.showDishesTable = true;
      },
      disheTableClose(done) {
        this.selectCate = [];
        this.initModeldishes = [];
        done();
      },
      cateClick(item) {
        if (!item.isSelect) {
          for (let i = 0; i < this.initModeldishes.length; i++) {
            this.initModeldishes[i].cate.isSelect = false;
            for (let s = 0; s < this.initModeldishes[i].dishes.length; s++) {
              this.initModeldishes[i].dishes[s].isSelect = false;

            }
          }
          item.isSelect = true;
          this.selectCate = item;
        }
      },
      selectAllDishe() {
        for (let i = 0; i < this.initModeldishes.length; i++) {
          if (this.selectCate.id == this.initModeldishes[i].cate.id) {
            for (let s = 0; s < this.initModeldishes[i].dishes.length; s++) {
              this.initModeldishes[i].dishes[s].isSelect = true;
            }
          }
        }
      },
      noSelectAllDishe() {
        for (let i = 0; i < this.initModeldishes.length; i++) {
          for (let s = 0; s < this.initModeldishes[i].dishes.length; s++) {
            this.initModeldishes[i].dishes[s].isSelect = false;
          }
        }
      },
      addDishes() {
        let selectDishes = [];
        for (let i = 0; i < this.initModeldishes.length; i++) {
          let dishes = this.initModeldishes[i].dishes.filter(x=>x.isSelect);
          selectDishes.push(...dishes);
        }

        let addDishes = [];
        for (let s = 0; s < selectDishes.length; s++) {
          var item = selectDishes[s];
          var index = this.groupConfig.selectDishes.findIndex(x=>x.id==item.id);
          if(index>=0){
            this.$message.error("不能重复添加菜品");
            return;
          }else{
            addDishes.push(item);
          }
        }
        var items = addDishes.map(x=>{console.log(x);return {id:x.id, name:x.name, cateId:x.cateId}});
        this.groupConfig.selectDishes.push(...items);
      },
      searchTextClick() {
        for (let i = 0; i < this.initModeldishes.length; i++) {
          this.initModeldishes[i].cate.isSelect = false;
        }
        this.noSelectAllDishe();
        this.$http.get("coupons/findSearch?dishesName=" + this.searchText).then((data) => {
          if (data.status == 200 && data.content.length > 0) {
            for (let s = 0; s < data.content.length; s++) {
              data.content[s].isSelect = false;
              data.content[s].isSearch = true;
            }
            this.selectCate = {id: "", isSelect: true, name: "搜索结果"};
            if (this.initModeldishes[0].cate.id) {
              this.initModeldishes.splice(0, 0, {
                cate: {id: "", isSelect: true, name: "搜索结果"},
                dishes: data.content
              })
            } else {
              this.initModeldishes.splice(0, 1, {
                cate: {id: "", isSelect: true, name: "搜索结果"},
                dishes: data.content
              })
            }
          } else {
            this.selectCate = {id: "", isSelect: true, name: "搜索结果"};
          }
        });
      },
      findSelectDishes: function () {
        this.$http.get("coupons/findSelectDishes?dishesName=").then((data) => {
          if (data.status == 200 && data.content.length > 0) {
            for (let i = 0; i < data.content.length; i++) {
              data.content[i].cate.isSelect = false;

              for (let s = 0; s < data.content[i].dishes.length; s++) {
                data.content[i].dishes[s].isSelect = false;
              }
            }
            if(this.groupConfig.dishes==null){
              data.content[0].cate.isSelect = true;
            }
            this.selectCate = data.content[0].cate;
            this.initModeldishes = data.content;
            //可兑换
            if(this.groupConfig.dishes){
              var cateId = this.groupConfig.dishes.cateId;
              var index = this.initModeldishes.findIndex(x=>x.cate.id==cateId);
              this.initModeldishes[index].cate.isSelect = true;

            }
          }
        });
      },
      disheQuerySearch: function (query) {
        this.$http.get("coupons/findAllDishes?dishesName=" + query).then((data) => {
          if (data.status == 200 && data.content.length > 0) {
            var returnlist = [];
            var list = data.content;
            var type = "";
            var spName = "";
            for (var i = 0; i < list.length; i++) {
              if (list[i].type == 'PACKAGE') {
                type = '【套餐】';
              }
              if (list[i].spName != null) {
                spName = list[i].spName;
                returnlist.push({
                  id: list[i].id,
                  value: list[i].name + type + "【" + spName + "】",
                  dsrId: list[i].dsrId,
                  price: list[i].price,
                  vipPrice: list[i].vip_price
                });
              } else {
                returnlist.push({
                  id: list[i].id,
                  value: list[i].name + type,
                  dsrId: list[i].dsrId,
                  price: list[i].price,
                  vipPrice: list[i].vip_price
                });
              }

            }
            this.dishs = returnlist;
          } else {
            this.dishs = [];
          }
        });
      }
    }
  }
</script>
<style scoped>
  .dialog-title {
    height: 44px;
    line-height: 44px;
    background-color: #ddd;
    margin-left: -15px !important;
    padding-left: 5px;
  }

  .dialog-title-right {
    height: 44px;
    line-height: 44px;
    background-color: #ddd;
    margin-right: -15px !important;
    padding-left: 5px;
  }

  .cateItem {
    padding: 10px;
  }

  .cateItemActive {
    background-color: #1ab394;
    color: #FFF;
    font-size: 14px;
    font-weight: 700;
  }

  .dishes-item {
    padding: 10px;
    border-bottom: 1px solid #ddd;
  }

  .select-dishes-item {
    padding: 10px 15px;
    margin-bottom: -1px;
    margin-left: 15px;
    background-color: #fff;
    border: 1px solid #ddd;
  }

</style>
